<!--
 * @Author: your name
 * @Date: 2020-12-07 15:21:11
 * @LastEditTime: 2021-03-23 09:56:56
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \solaxcloud\src\views\warranty\add.vue
-->
<template>
    <div>
        <el-dialog
        :title="$t('add')"
        :visible="newVisiblePvModules"
        width="1000px"
        @close="()=>{$store.commit('setNewVisiblePvModules',false)}"
        :close-on-click-modal='false'
        >   
            <el-form ref="form" :model="form" label-width="190px" >
                <el-row :gutter="20" >
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warrantyManage.userName')" prop="loginName" :rules="[{ required: false, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.loginName" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('country')" prop="nation" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-select v-model="form.nation" filterable :placeholder="$t('pleaseSeldect')" clearable style="width:100%" @change='nationChange'>
                                <el-option
                                    v-for="item in nationList"
                                    :key="item.enName"
                                    :label="item.enName"
                                    :value="item.enName">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0" v-if='form.nation == "UNITED KINGDOM"'>
                        <el-form-item label="Social Energy Installation" prop="IsSEACKIT" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-radio v-model="form.IsSEACKIT" label="0">Yes</el-radio>
                            <el-radio v-model="form.IsSEACKIT" label="1">No</el-radio>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('userName')" prop="userName" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.userName" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.address')" prop="address" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.address" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.postCode')" prop="postCode" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.postCode" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.photoNumber')" prop="phone" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.phone" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('email')" prop="email" :rules="[{ required: true, message: $t('index_js_notNull')},{ type: 'email', message:$t('user.msg_reg_email'), trigger: ['blur', 'change']}]">
                            <el-input v-model="form.email" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.emailCC.msg')" prop="ccEmail" :rules="[{ required: false, message: $t('index_js_notNull')},{ type: 'email', message:$t('user.msg_reg_email'), trigger: ['blur', 'change']}]">
                            <el-input v-model="form.ccEmail" :placeholder="$t('pleaseInput')" style="width:90%;"></el-input>
                            <el-tooltip class="icon-nmi" placement="top">
                                <div slot="content">
                                    {{$t('warranty.emailCC.will')}}
                                </div>
                                <i class="el-icon-question iconClass"></i>
                            </el-tooltip>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.addName')" prop="installer" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.installer" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.addData')" prop="installTime" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-date-picker
                            v-model="form.installTime"
                            type="date"
                            :placeholder="$t('selectDate')"
                            value-format='yyyy-MM-dd'
                            :clearable='true'
                            :picker-options="pickerOptions"
                            >
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warranty.srotNumber')" prop="inverterSn" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.inverterSn" :placeholder="$t('pleaseInput')" @blur="getInverterType"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('invoice.deviceType')" prop="model" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-select v-model="form.model" filterable :placeholder="$t('pleaseSelect')" clearable style="width:100%" :disabled="flagType">
                                <el-option
                                    v-for="item in inverterType"
                                    :key="item.sid"
                                    :label="item.inverterTypeName"
                                    :value="item.inverterTypeName">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0" v-if='returnOtherName(form.model) == 99'>
                        <el-form-item :label="$t('warranty.other')" prop="model" :rules="[{ required: true, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.deviceTypeName" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warrantyManage.promotion_code')" prop="saleCode" :rules="[{ required: false, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.saleCode" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warrantyManage.extension_code')" prop="delayCode" :rules="[{ required: false, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.delayCode" :placeholder="$t('pleaseInput')"></el-input>
                        </el-form-item>
                    </el-col>
                    
                    <el-col :span="11" :offset="0">
                        <el-form-item :label="$t('warrantyStatistics.batterySN')" prop="batterySN" :rules="[{ required: false, message: $t('index_js_notNull')}]">
                            <el-input v-model="form.batterySN" :placeholder="$t('pleaseInput')" ></el-input>
                        </el-form-item>
                    </el-col>
                    
                </el-row>
                <el-row :gutter="20" >
                    <el-col :span="11" :offset="3">
                        <p style="color:red;">{{$t('warranty.newAddDataMsgWarrany')}}</p>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="()=>{$store.commit('setNewVisiblePvModules',false)}">{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="save('form')">{{$t('sure')}}</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    components: {

    },
    props: {
        nationList:{
            type:Array,
            default:()=>{ return []}
        },
        inverterType:{
            type:Array,
            default:()=>{return []}
        }
    },
    data() {
        return {
            form:{
                loginName:JSON.parse(localStorage.getItem('appUserObject') || "{loginName:''}").loginName,
                nation:'',
                userName:'',
                address:'',
                postCode:'',
                phone:'',
                installTime:'',
                installer:'',
                inverterSn:'',
                model:'',
                email:'',
                delayCode:'',
                saleCode:'',
                batterySN:'',
                IsSEACKIT:'',
                deviceTypeName:''
            },
            typeList:[],
            pickerOptions:{ //禁用今天之后的时间
                disabledDate(time) {
                    return time.getTime() > Date.now()
                }
            },
            oldSN:'',
            flagType:false,
            copyInverter:this.inverterType ? JSON.parse(JSON.stringify(this.inverterType)):[]
        };
    },
    computed: {
        newVisiblePvModules(){
            return this.$store.state.sysStore.newVisiblePvModules
        },
        deviceType(){
            let type= ''
            this.inverterType.forEach(item =>{
                if(item.inverterTypeName == this.form.model){
                    type = item.inverterType
                }
            })
            return type
        }
    },
    watch: {
        // newVisiblePvModules:{
        //     handler(nv,ov){
        //         if(nv){
        //             console.log(this.inverterType,'this.inverterType');
        //             this.copyInverter = JSON.parse(JSON.stringify(this.inverterType))
        //         }
        //     },
        //     deep:true
        // }
    },
    created() {

    },
    mounted() {
        this.form.loginName = JSON.parse(localStorage.getItem('appUserObject') || "{loginName:''}").loginName
    },
    methods: {
        nationChange(){
            if(this.form.nation == 'JAPAN'){
                this.orderpaypalconfigGetInverterTypeList()
                this.form.model = ''
            }else{
                this.inverterType = this.copyInverter
            }
        },
        async orderpaypalconfigGetInverterTypeList(){
            let res = await this.API.orderpaypalconfigGetInverterTypeList({
                inverterTypeName:this.form.nation
            })
            this.inverterType = res
        },
        returnOtherName(code){
            let type = ''
            this.inverterType.forEach(item=>{
                if(item.inverterTypeName == code){
                    type = item.inverterType
                }
            })
            return type
        },
        returnSnFlag(code){
            let type = ''
            this.inverterType.forEach(item=>{
                if(item.inverterTypeName == code){
                    type = item.snCheckFlag
                }
            })
            return type
        },
        async getInverterType(){
            let reg = /^[A-Za-z0-9\-]+$/
            if(this.form.inverterSn){
                var inverterSn = this.form.inverterSn
                inverterSn = inverterSn.toUpperCase()
                this.form.inverterSn = inverterSn
            }
            if(!reg.test(this.form.inverterSn)){
                this.comm.showMsg(false, this.$t('warranty.batchSend.message4'))
                return false;
            }
            if(this.form.inverterSn.split('').length != 14){
                this.comm.showMsg(false, this.$t('warranty.batchSend.message4'))
                return false;
            }
            if(!(this.form.inverterSn && this.form.inverterSn != this.oldSN)){
                return
            }
            let res = await this.API.orderpaypalconfigGetInverterType({
                inverterSn:this.form.inverterSn
            })
            if(res){
                this.form.model = res.inverterTypeName
                this.flagType = true
            }else{
                this.flagType = false
            }
            this.oldSN = this.form.inverterSn
        },
        async qualitySave(){
            let reg = /^[A-Za-z0-9]+$/
            let reg2 = /^[A-Za-z0-9\-]+$/
            let checkFlag = this.returnSnFlag(this.form.model)
            if(this.form.inverterSn){
                var inverterSn = this.form.inverterSn
                inverterSn = inverterSn.toUpperCase()
                this.form.inverterSn = inverterSn
            }
            if(checkFlag === 0){
                if(!reg2.test(this.form.inverterSn)){
                    this.comm.showMsg(false,this.$t('warranty.batchSend.message4'))
                    return false;
                }
            }else{
                if(!reg.test(this.form.inverterSn)){
                    this.comm.showMsg(false,this.$t('warranty.batchSend.message4'))
                    return false;
                }
            }
            if(this.form.inverterSn.split('').length != 14){
                this.comm.showMsg(false,this.$t('warranty.batchSend.message4'))
                return false;
            }
            if(this.form.batterySN){
                let res = await this.API.crmbatteryqualityCheckBatterySN({
                    batterySNList:this.form.batterySN
                })
                if(res.success == false){
                    if(res.object.length>0){
                        this.comm.showMsg(false,this.$t('warranty.newAddDataMsgRepeat')+res.object)
                    }else{
                        this.comm.showMsg(false,this.$t('index.control_fail'))
                    }
                    return
                }
            }
            let newObj = JSON.parse(JSON.stringify(this.form))
            if(this.returnOtherName(this.form.model) != 99){
                delete newObj.deviceTypeName
            }
            let res2 = await this.API.qualitySave(Object.assign({},newObj,{deviceType:this.deviceType}))
            if(this.comm.showMsg(res2.success,res2.success?this.$t('warranty.successsMsg'):this.$t('index.control_fail'))){
                this.$store.commit('setNewVisiblePvModules',false)
                this.$emit('uploadData',true)
            }else{
                if(res2.object=='1'){
                    // openMsg(getText("#msgErroy1"));
                    this.comm.showMsg(false,this.$t('warrantyManage.msgErroy1'))
					return
				}
				if(res2.object=='2'){
                    // openMsg(getText("#msgErroy2"));
                    this.comm.showMsg(false,this.$t('warrantyManage.msgErroy2'))
					return
				}
				if(res2.object=='3'){
                    // openMsg(getText("#msgErroy3"));
                    this.comm.showMsg(false,this.$t('warrantyManage.msgErroy3'))
					return
				}
				if(!res2.object){
					// openMsg(res2.msg);
					return
				}
            }
        },
        save(formName){
            this.$refs[formName].validate((valid) => {
              if (valid) {
                  this.qualitySave()
              } else {
                console.log('error submit!!');
                return false;
              }
            });
        },
    },
};
</script>

<style  lang="less" scoped>

</style>

